   $(document).ready(function () {
        var arrName = new Array();
        var arrValue = new Array();
        var arrNameValue = [];
        url = "/Statistic/SetVolunteerResult"
        $.post(url, function (data) {
            for (var i = 0; i < data.length; ++i) {
                arrName.push(data[i].Name);
                arrValue.push(data[i].Value);
                arrNameValue.push([data[i].Name, data[i].Value]);
            }
            //<!-- 第一个柱状图的js -->
            $('#container1').highcharts({
                chart: {
                    type: 'column'
                },
                title: {
                    text: '志愿者统计表'
                },
                subtitle: {
                    text: ''
                },
                xAxis: {
                    categories: arrName
                },
                yAxis: {
                    min: 0,
                    title: {
                        text: '志愿者人数（人）'           //Y轴的计量单位
                    }
                },
                tooltip: {
                    headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
                    pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
                        '<td style="padding:0"><b>{point.y} 人</b></td></tr>',       //鼠标悬浮时显示的内容
                    footerFormat: '</table>',
                    shared: true,
                    useHTML: true
                },
                plotOptions: {
                    column: {
                        pointPadding: 0.2,                          //柱的宽度设置
                        borderWidth: 0
                    }
                },
                series: [{
                    name: '志愿者人数',                               //鼠标悬浮时显示的计量单位
                    data: arrValue          //图表的数据
                }],
                credits: {
                    enabled: false
                }
            });
            //<!-- 第一个柱状图js结束 -->
            //<!-- 第二个饼状图js开始 -->
            $('#container2').highcharts({
                chart: {
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false
                },
                title: {
                    text: '志愿者人数占比统计表'             //表头
                },
                tooltip: {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'        //鼠标悬浮时显示的百分比格式
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: true,
                            color: '#000000',
                            connectorColor: '#000000',
                            format: '<b>{point.name}</b>: {point.percentage:.1f} %'     //鼠标悬浮时显示的百分比格式
                        }
                    }
                },

                series: [{
                    type: 'pie',
                    name: '志愿者人数占比',                                                 //悬浮时候显示的提示内容
                    data: arrNameValue
                }]
            });
            //<!-- 第二个饼状图js结束 -->
            //<!-- 第三个折线图js开始 -->
            $('#container3').highcharts({
                title: {
                    text: '志愿者统计表',        //表头
                    x: -20 //center
                },
                subtitle: {
                    text: '',
                    x: -20
                },
                xAxis: {
                    categories: arrName             //X轴的统计项
                },
                yAxis: {
                    title: {
                        text: '志愿者人数（人）'           //Y轴的计量单位
                    },
                    plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                    }]
                },
                tooltip: {
                    valueSuffix: '人'                //鼠标悬浮时候显示的数据的计量单位
                },
                legend: {
                    layout: 'vertical',
                    align: 'right',
                    verticalAlign: 'middle',
                    borderWidth: 0
                },
                series: [{
                    name: '志愿者',
                    data: arrValue  //Y轴数据，从前到后依次为X轴的各个项目
                }]
            });
            //<!-- 第三个折线图js结束 -->
        })
    })
